<template>
  <section class="editCarBrand">
    <el-dialog
      v-dialogDrag
      :close-on-click-modal="false"
      :title="textMap[popupsState]"
      :append-to-body="true"
      :visible.sync="curPopupsVisible"
      width="600px"
      @close="sendCode"
    >
      <dialogHeader
        slot="title"
        :title="textMap[popupsState]"
        :styleType="$store.state.app.dialogType"
      ></dialogHeader>
      <div class="filter-container filter-params">
        <el-row :gutter="26">
          <component
            v-for="comp in tableComponents.filter(o => o.isMust === true)"
            :ref="comp.isRequire ? comp.isRequire+ comp.compKey : comp.compKey"
            :validrule="comp.validrule"
            :key="comp.compKey"
            :codeField="comp.codeField"
            :textField="comp.textField"
            :popupsKey="comp.compKey"
            :is="comp.component"
            :code="formField[comp.codeField]"
            :text="formField[comp.textField]"
            @changeCode="getComponentCode"
            @focusCode="getFocusCode"
            :disabled="comp.disabled"
            :isRequire="comp.isRequire"
            :span="comp.span || 8"
            :isMul="comp.isMul"
            :labelName="comp.labelName"
            :lookuptype="comp.lookuptype"
            :options="comp.options"
            :dateOptionsType="comp.dateOptionsType"
            :isInput="comp.isInput"
            :dataToObject="comp.dataToObject"
          ></component>
        </el-row>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button
          v-for="comp in tableButtons"
          :key="comp.compKey"
          :type="comp.type"
          @click="comp.clickEvent"
        >{{ comp.text }}</el-button>
      </div>
    </el-dialog>
  </section>
</template>
<script>
import { formMixins } from "@/components/wms/mixins/formMixins";
import { basedataApi } from "@/api/wms/basedata";
import requesta from "../../../../utils/request.js";
import storage from "@/utils/storage";
export default {
  // 组件混入对象
  mixins: [formMixins],
  components: {
    dialogHeader: () => import("@/components/dialogHeader") //弹窗标题
  },
  props: {
    warehouseArr: {
      type: Array,
      default: []
    }
  },
  watch: {},
  data() {
    return {
      // 保存API配置对象
      apiConfig: basedataApi.saveplace,
      // 动态组件-按钮
      tableButtons: [
        {
          compKey: "btnKey1",
          type: "primary",
          size: "small",
          clickEvent: () => this.save(),
          text: "保存" //"保存"
        },
        {
          compKey: "btnKey2",
          type: "",
          size: "small",
          clickEvent: () => this.reset(),
          text: "重置" //"重置"
        }
      ],
      // 动态组件-查询条件
      tableComponents: [
        {
          compKey: "edit_compKey1",
          labelName: "仓库名称",
          codeField: "WAREHOUSE_ID",
          component: () => import("@/components/wms/dropdownList/dropdownList"),
          type: "dropdownList",
          span: 23,
          isMust: true,
          isMul: false,
          options: this.warehouseArr,
          isRequire: true,
          disabled: !this.isAdd(),
          changed: e => {
            this.tableComponents[1].options = [];
            if (!e) {
              return;
            }
            requesta({
              url: "/mp/wm/vl/basedata/place/queryarea.do",
              method: "POST",
              data: {
                WAREHOUSE_ID: e
              }
            }).then(res => {
              res.listRow.map(item => {
                this.tableComponents[1].options.push({
                  label: item.AREA_CODE,
                  value: item.AREA_CODE
                });
              });
            });
          }
        },
        {
          compKey: "edit_compKey2",
          labelName: "库区编号",
          codeField: "AREA_CODE",
          component: () => import("@/components/wms/dropdownList/dropdownList"),
          type: "dropdownList",
          span: 23,
          isMust: true,
          isMul: false,
          options: [],
          isRequire: true
        },
        {
          compKey: "edit_compKey3",
          labelName: "库位编号",
          span: 23,
          codeField: "PLACE_CODE",
          component: () => import("@/components/wms/commonInput"),
          type: "inputText",
          isMust: true,
          disabled: !this.isAdd(),
          isRequire: true
        },
        {
          compKey: "edit_compKey4",
          labelName: "可拣货标识",
          codeField: "IS_PICK",
          component: () => import("@/components/wms/dropdownList/dropdownList"),
          type: "dropdownList",
          span: 23,
          isMust: true,
          options: [
            {
              label: "是",
              value: "1"
            },
            {
              label: "否",
              value: "0"
            }
          ],
          isRequire: true
        },
        {
          compKey: "edit_compKey5",
          labelName: "可上架标识",
          codeField: "IS_PUTON",
          component: () => import("@/components/wms/dropdownList/dropdownList"),
          type: "dropdownList",
          span: 23,
          isMust: true,
          options: [
            {
              label: "是",
              value: "1"
            },
            {
              label: "否",
              value: "0"
            }
          ],
          isRequire: true
        },
        {
          compKey: "edit_compKey6",
          labelName: "可混装标识",
          codeField: "IS_MIX",
          component: () => import("@/components/wms/dropdownList/dropdownList"),
          type: "dropdownList",
          span: 23,
          isMust: true,
          options: [
            {
              label: "是",
              value: "1"
            },
            {
              label: "否",
              value: "0"
            }
          ],
          isRequire: true
        },
        {
          compKey: "edit_compKey7",
          labelName: "体积无限标识",
          codeField: "IS_INFINITY",
          component: () => import("@/components/wms/dropdownList/dropdownList"),
          type: "dropdownList",
          span: 23,
          isMust: true,
          options: [
            {
              label: "是",
              value: "1"
            },
            {
              label: "否",
              value: "0"
            }
          ],
          isRequire: true
        },
        {
          compKey: "edit_compKey88",
          labelName: "TPS",
          span: 23,
          codeField: "TPS",
          component: () => import("@/components/wms/commonInput"),
          type: "inputText",
          isMust: true,
          isRequire: true
        },
        {
          compKey: "edit_compKey9",
          labelName: "长（cm）",
          span: 23,
          codeField: "PLACE_LENGTH",
          component: () => import("@/components/wms/commonInput"),
          type: "inputText",
          isMust: true,
          isRequire: true,
          isInput: true,
          changed: val => {
            if (!val) {
              this.formField.PLACE_CUBAGE = "";
              return;
            }
            if (this.formField.PLACE_LENGTH < 1) {
              this.$refs["trueedit_compKey9"][0].modelCode = 1;
              this.formField.PLACE_LENGTH = 1;
            }
            this.$refs["trueedit_compKey9"][0].modelCode = (
              this.formField.PLACE_LENGTH + ""
            )
              .replace(/[^\d^\.]+/g, "")
              .replace(".", "$#$")
              .replace(/\./g, "")
              .replace("$#$", ".");
            this.formField.PLACE_LENGTH = (this.formField.PLACE_LENGTH + "")
              .replace(/[^\d^\.]+/g, "")
              .replace(".", "$#$")
              .replace(/\./g, "")
              .replace("$#$", ".");
            this.numInput();
          },
          dataToObject: {
            maxLength: 10
          }
        },
        {
          compKey: "edit_compKey10",
          labelName: "宽（cm）",
          span: 23,
          codeField: "PLACE_WIDE",
          component: () => import("@/components/wms/commonInput"),
          type: "inputText",
          isMust: true,
          isRequire: true,
          isInput: true,
          changed: val => {
            if (!val) {
              this.formField.PLACE_CUBAGE = "";
              return;
            }
            if (this.formField.PLACE_WIDE < 1) {
              this.$refs["trueedit_compKey10"][0].modelCode = 1;
              this.formField.PLACE_WIDE = 1;
            }
            this.$refs["trueedit_compKey10"][0].modelCode = (
              this.formField.PLACE_WIDE + ""
            )
              .replace(/[^\d^\.]+/g, "")
              .replace(".", "$#$")
              .replace(/\./g, "")
              .replace("$#$", ".");
            this.formField.PLACE_WIDE = (this.formField.PLACE_WIDE + "")
              .replace(/[^\d^\.]+/g, "")
              .replace(".", "$#$")
              .replace(/\./g, "")
              .replace("$#$", ".");
            this.numInput();
          },
          dataToObject: {
            maxLength: 10
          }
        },
        {
          compKey: "edit_compKey11",
          labelName: "高（cm）",
          span: 23,
          codeField: "PLACE_HIGH",
          component: () => import("@/components/wms/commonInput"),
          type: "inputText",
          isMust: true,
          isRequire: true,
          isInput: true,
          changed: val => {
            if (!val) {
              this.formField.PLACE_CUBAGE = "";
              return;
            }
            if (this.formField.PLACE_HIGH < 1) {
              this.$refs["trueedit_compKey11"][0].modelCode = 1;
              this.formField.PLACE_HIGH = 1;
            }
            this.$refs["trueedit_compKey11"][0].modelCode = (
              this.formField.PLACE_HIGH + ""
            )
              .replace(/[^\d^\.]+/g, "")
              .replace(".", "$#$")
              .replace(/\./g, "")
              .replace("$#$", ".");
            this.formField.PLACE_HIGH = (this.formField.PLACE_HIGH + "")
              .replace(/[^\d^\.]+/g, "")
              .replace(".", "$#$")
              .replace(/\./g, "")
              .replace("$#$", ".");
            this.numInput();
          },
          dataToObject: {
            maxLength: 10
          }
        },
        {
          compKey: "edit_compKey12",
          labelName: "库位体积（cm³）",
          span: 23,
          codeField: "PLACE_CUBAGE",
          disabled: true,
          component: () => import("@/components/wms/commonInput/numberInput"),
          dataToObject: {
            maxWordCount: 8
          },
          type: "inputText",
          isMust: true,
          isRequire: true
        },
        {
          compKey: "edit_compKey13",
          labelName: "启用状态",
          codeField: "IS_ENABLE",
          component: () => import("@/components/wms/dropdownList/dropdownList"),
          type: "dropdownList",
          options: [
            {
              label: "禁用",
              value: "0"
            },
            {
              label: "启用",
              value: "1"
            }
          ],
          span: 23,
          isMust: true,
          isRequire: true
        }
      ],
      // 标题
      textMap: {
        edit: "编辑库位管理",
        add: "新增库位管理"
      },
      // 表单数据（无需赋值，由混入对象赋值）
      formField: {
        PLACE_ID: "",
        WAREHOUSE_ID: "",
        AREA_CODE: "",
        PLACE_CODE: "",
        IS_PICK: "",
        IS_PUTON: "",
        IS_MIX: "",
        IS_INFINITY: "",
        TPS: "",
        PLACE_LENGTH: "",
        PLACE_WIDE: "",
        PLACE_HIGH: "",
        PLACE_CUBAGE: "",
        IS_ENABLE: ""
      },
      WAREHOUSE_USER: [],
      LENGTH: "",
      WIDTH: "",
      HEIGHT: ""
    };
  },
  created() {
    if (this.curPopupsVisible) {
      this.dropdownList();
      if (this.isAdd()) {
        this.formField.WAREHOUSE_ID = this.warehouseArr[0].value;
        this.formField.IS_ENABLE = this.tableComponents[12].options[1].value;
        this.formField.IS_PICK = this.tableComponents[3].options[0].value;
        this.formField.IS_PUTON = this.tableComponents[4].options[0].value;
        this.formField.IS_MIX = this.tableComponents[5].options[1].value;
        this.formField.IS_INFINITY = this.tableComponents[6].options[1].value;
      } else {
        this.LENGTH = this.formField.PLACE_LENGTH;
        this.WIDTH = this.formField.PLACE_WIDE;
        this.HEIGHT = this.formField.PLACE_HIGH;
      }
    }
  },
  methods: {
    numInput(code, key) {
      if (
        this.formField.PLACE_LENGTH &&
        this.formField.PLACE_WIDE &&
        this.formField.PLACE_HIGH
      ) {
        this.formField.PLACE_CUBAGE =
          (this.formField.PLACE_LENGTH - 0) *
          (this.formField.PLACE_WIDE - 0) *
          (this.formField.PLACE_HIGH - 0);
      }
    },
    dropdownList() {
      requesta({
        url: "/mp/wm/vl/basedata/place/queryarea.do",
        method: "POST",
        headers: {
          "Cache-Control": "no-cache, no-store,max-age=0, must-revalidate",
          Pragma: "no-cache",
          Expires: "0",
          "Content-Type": "application/json;charset=UTF-8"
        },
        data: {
          WAREHOUSE_ID: this.warehouseArr[0].value
        }
      }).then(res => {
        res.listRow.map(item => {
          this.tableComponents[1].options.push({
            label: item.AREA_CODE,
            value: item.AREA_CODE
          });
        });
      });
    },
    //保存
    save() {
      this.$utils.validataMoth(this, "validpopup");
      if (this.valid) {
        var saveObj = JSON.parse(JSON.stringify(this.formField));
        //保存表单
        this.saveForm(saveObj);
        storage.remove(this.$route.query.pageCode);
      }
    }
  }
};
</script>
<style type="text/css" scoped>
.filter-params .el-col label .curName {
  width: 150px;
}
</style>
